<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>应用HTML元素的样式属性设计横向下拉菜单</title>
<link href="css/style.css" rel="stylesheet" type="text/css" />
<link href="css/global.css" rel="stylesheet" type="text/css" />

<script type="text/javascript">
  function menu_drop(menuId, displayWay)
  {
	  document.getElementById(menuId).style.display=displayWay;
  }
</script>

</head>

<body>
<div id="con">
  <div id="title">
    <div class="nav">
      <ul id="droplist_ul">
        <li id="n0"><em></em></li>
        <li><em><a href="">首页</a></em></li>
        <li onmouseover="menu_drop('n1','block');" onmouseout="menu_drop('n1','none');">
          <em><a href="">县城介绍</a></em>
          <ul id="n1">
            <li><a href="">走进新化</a></li>
            <li><a href="">风土人情</a></li>
          </ul>
        </li>
        <li onmouseover="menu_drop('n2','block');" onmouseout="menu_drop('n2','none');">
          <em><a href="">景点介绍</a></em>
          <ul id="n2">
            <li><a href="">大熊山</a></li> 
            <li><a href="">梅山龙宫</a></li>
            <li><a href="">紫鹊界梯田</a></li>
            <li><a href="">新化北塔</a></li>
            <li><a href="">油溪河漂流</a></li>
            <li><a href="">桃花源地奉家山</a></li>
          </ul>
        </li>
        <li><em><a href="">风景美图</a></em></li>
      </ul>
    </div>
    <div class="clear"></div>
  </div>
</div>
</body>
</html>
